<template>
	<div class="yule-box">
		<div class="yulecontainer" v-for="item in this.$store.state.yuleNewList">
			<div class="titel">{{ item.title }}</div>
			<div class="imgerer">
				<img :src="item.thumbnail_pic_s" alt="">
				<img :src="item.thumbnail_pic_s02" alt="">
			</div>
		</div>
	</div>
</template>

<script>
	import { nowNew } from '../libs/getData.js'
	export default {
		name: 'YuLe',
		mounted() {
			nowNew('yule')
		}
	}
</script>

<style lang="less" scoped="scoped">
	.yule-box{
		width: 100%;
		padding-top: .38rem;
		.yulecontainer{
			width: 96%;
			height: 1.4rem;
			margin: 5px 2%;
			.titel{
				width: 100%;
				height: .3rem;
				line-height: .3rem;
				border-bottom: 0.2px solid #aaa;
				padding-left: .1rem;
				font-size: .16rem;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
			.imgerer{
				width: 100%;
				height: 1.1rem;
				display: flex;
				justify-content: space-around;
				img{
					width: 42%;
					background-color: red;
				}
			}
		}
	}
</style>